<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>圈子列表</title>
    <link href="${pageContext.request.contextPath}/static/js/plugins/DataTables/media/css/dataTables.bootstrap.min.css" rel="stylesheet"/>
    <link href="${pageContext.request.contextPath}/static/js/plugins/bootstrap-switch/css/bootstrap3/bootstrap-switch.min.css" rel="stylesheet"/>
    <link href="${pageContext.request.contextPath}/static/js/plugins/bootstrap-datetimepicker/css/datetimepicker.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/static/css/customer.css">
</head>
<body>
<div>
    <div class="row">
        <div class="panel panel-inverse">
            <div class="panel-heading custom-panel-heading">
                <h4 class="panel-title">圈子列表</h4>
            </div>
            <div class="panel-body">
                <div class="form-group m-r-10">
                    <input type="button" id="create_article" class="btn btn-primary"
                           onclick="create_circle_list()" value="新建"/>
                </div>
            </div>
        </div>
        <div class="panel panel-inverse">
            <div class="panel-body">
                <table class="table table-bordered" id="circle_list_table">
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>名称</th>
                        <th>图片</th>
                        <th>描述</th>
                        <th>状态</th>
                        <th>权重</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody id="tableBody">
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="circle_list_modal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="panel panel-inverse">
                <div class="panel-heading">
                    <button type="button" class="close" data-dismiss="modal"
                            aria-hidden="true">
                    </button>
                    <h5 class="panel-title">banner</h5>
                </div>
            </div>
            <div class="panel-body">
                <form id="user_form" class="form-horizontal form-bordered"
                      data-parsley-validate="true" action="#" method="post">
                    <input type="hidden" id="circle_id">


                    <div class="form-group">
                        <label for="name" class="col-md-3 control-label">名称</label>
                        <div  class="col-md-9">
                            <input type="text" class="form-control" placeholder="名称" autocomplete="off"
                                   id="name" name="name">
                        </div>
                    </div>


                    <div class="form-group">
                        <label class="col-md-3 control-label title">图片</label>
                        <div class="col-md-9 upload-group">
                            <input type="button" class="btn btn-success m-r-5 m-b-5 upload-btn" value="上传图片"/>
                            <input type="file" id="img" accept="image/jpg,image/jpeg,image/png"  data-accept="image/*" class="hide"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label"></label>
                        <div class="col-md-9 show-file">
                        </div>
                    </div>


                    <div class="form-group">
                        <label for="description" class="col-md-3 control-label">描述</label>
                        <div  class="col-md-9">
                            <input type="text" class="form-control" placeholder="描述" autocomplete="off"
                                   id="description" name="description">
                        </div>
                    </div>


                    <div class="form-group">
                        <label for="recommend" class="col-md-3 control-label">推荐</label>
                        <div  class="col-md-9">
                            <input type="text" class="form-control" placeholder="推荐" autocomplete="off"
                                   id="recommend" name="recommend">
                        </div>
                    </div>



                    <div class="form-group">
                        <label for="status" class="col-md-3 control-label">状态</label>
                        <div  class="col-md-9">
                            <input type="text" class="form-control" placeholder="url" autocomplete="off"
                                   id="status" name="status">
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="weight" class="col-md-3 control-label">权重</label>
                        <div  class="col-md-9">
                            <input type="text" class="form-control" placeholder="排序权重" autocomplete="off"
                                   id="weight" name="weight">
                        </div>
                    </div>


                    <div class="modal-footer" style="padding-left: 42%;">
                        <a class="btn  btn-success pull-left  btn-sm m-r-5"
                           style="background-color: #169BD5; border: 0; margin-right: 20px;"
                           onclick="save_circle_list()">确定</a>
                        <a class="btn btn-info pull-left btn-sm m-r-5" data-dismiss="modal"
                           style="background-color: #CCCCCC; border: 0;">取消</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script src="${pageContext.request.contextPath}/static/js/plugins/jquery-ui/ui/minified/jquery-ui.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/DataTables/media/js/jquery.dataTables.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/DataTables/media/js/dataTables.bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/bootstrap-switch/js/bootstrap-switch.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/bootstrap-bundle/bootstrap.bundle.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/bootstrap/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/moment/moment.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/utils/ObjectUtils.js"></script>
<script src="${pageContext.request.contextPath}/static/js/utils/HttpUtils.js"></script>
<script src="${pageContext.request.contextPath}/static/js/utils/FilesUpload.js"></script>
<script src="${pageContext.request.contextPath}/static/js/utils/ModalUtils.js"></script>
<script src="${pageContext.request.contextPath}/static/js/utils/MsgUtils.js"></script>
<script src="${pageContext.request.contextPath}/static/js/utils/DateUtils.js"></script>
<script src="${pageContext.request.contextPath}/static/js/utils/datatable_init.js"></script>
<script src="${pageContext.request.contextPath}/static/js/utils/datatable_constant.js"></script>
<script src="${pageContext.request.contextPath}/static/js/utils/datatable_core.js"></script>
<script src="${pageContext.request.contextPath}/static/js/circle/index.js"></script>
<script>
</script>
</body>
</html>